<template>
  <div>
    <h3>哈哈哈:我是详情页</h3>
    <p>品牌：{{ item?.name }}</p>
    <p>价格：{{ item?.price }}</p>
    <p>id：{{ item?.id  }}</p>
    <!-- <p>品牌：{{ route.query.name }}</p>
    <p>价格：{{ route.query.price }}</p>
    <p>id：{{ route.query.id  }}</p> -->
  </div>
</template>

<script setup lang="ts">
import { data } from '../assets/commodity.json'
import { useRoute } from 'vue-router'
const route = useRoute()

const item = data.find(item => item.id === Number(route.query.id))
</script>

<style scoped>

</style>
